<template>
	<view class="flex align-center bgF3F5FA mb-2 p-2 rounded-lg">
		<image class="rounded bg-white" :src="item.heading" mode="aspectFill" style="width: 176rpx;height: 176rpx;"
			@tap="navTo(`/pages/playerhome/playerhome?id=${item.id}`)">
		</image>
		<view class="flex flex-column flex-1 ml-2">
			<view class="flex align-center" @tap="navTo(`/pages/playerhome/playerhome?id=${item.id}`)">
				<text class="fs-32 text-black font-weight-light">{{item.nickname}}</text>
				<image src="/static/imgs/renzheng.png" mode="aspectFill" class="w-32 h-32 ml-1" v-if="item.is_verified === 1">
				</image>
				<image v-if="item.nationality && item.nationality.logo" :src="item.nationality.logo" mode="aspectFill"
					class="w-32 h-32 ml-1 rounded-circle flex-shrink"></image>
				<view class="flex align-center bgFF4CBE rounded-circle px-1 ml-1">
					<image :src="`/static/imgs/${item.gender === 2?'sex':'sex1'}.png`" mode="aspectFill"
						style="width: 20rpx;height: 20rpx;"></image>
					<text class="text-white fs-20">{{item.age}}</text>
				</view>
				<view class="flex align-center flex-1 justify-end">
					<image src="/static/imgs/hot_icon.png" mode="aspectFill" class="w-36 h-36"></image>
					<text class="ftFF685E fs-26 font-weight-light">{{abbreviateNumber(item.fire_balance)}}</text>
				</view>
			</view>
			<view class="flex align-center mt-2" @tap="navTo(`/pages/playerhome/playerhome?id=${item.id}`)">
				<view class="rounded px-1 py-1 flex align-center mr-1" v-for="(obj,index) in item.interests" :key="index"
					:style="{'background':obj.icon_bg_color||'#D5EDF8'}">
					<image :src="obj.icon" mode="aspectFill" class="w-28 h-28 rounded-circle"></image>
					<text class="ft666666 fs-20 ml-1">{{obj.name}}</text>
				</view>
			</view>
			<view class="flex align-center justify-between mt-3">
				<view class="flex align-center" @tap="navTo(`/pages/playerhome/playerhome?id=${item.id}`)">
					<view class="flex align-center ftFF0073">
						<text class="fs-34 font-weight-light">{{item.price}}</text>
						<image src="/static/imgs/jinbi.png" mode="aspectFill" class="w-28 h-28 mx-1"></image>
					</view>
					<text class="fs-24 text-black letter-spacing ml-1">/ {{$t('hhh.t7')}}</text>
				</view>
				<image src="/static/imgs/like.png" mode="aspectFill" class="w-48 h-48" @tap="addLikeAndCart"></image>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		abbreviateNumber
	} from '@/utils/common.js'
	import HttpApi from '@/api/httpApi';
	export default {
		props: {
			item: {
				type: Object,
				default: () => {}
			}
		},
		methods: {
			abbreviateNumber,
			addLikeAndCart() {
				this.addTimer && clearTimeout(this.addTimer)
				this.addTimer = null
				this.addTimer = setTimeout(() => {
					this.addCart()
					this.collectionCheck()
				}, 300)
			},
			addCart() {
				HttpApi.addCart({
					peipei_id: this.item.id,
				}).then(res => {
					if (res.code === 1) {
						uni.$tools.toast('Added successfully')
					}
				})
			},
			addCollection() {
				const club_id = uni.getStorageSync('club_id')
				HttpApi.addCollection({
					peipei_id: this.item.id,
					club_id: club_id
				}).then(res => {
					if (res.code === 1) {
						// uni.$tools.toast('Added successfully')
					}
				})
			},
			collectionCheck() {
				HttpApi.collectionCheck({
					peipei_id: this.item.id
				}).then(res => {
					if (res.code === 1 && !res.data.is_collected) {
						this.addCollection()
					}
				})
			},
			navTo(url) {
				uni.navigateTo({
					url: url
				})
			}
		}
	}
</script>

<style>
</style>